<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <p>不凡学院</p>
    <script>
        
        // 修改样式

        var pEl = document.getElementsByTagName('p')[0];
        pEl.onclick = function(){
            // pEl.style.font-size = '12px';
            // 改成驼峰命名
            pEl.style.fontSize = '12px';
            pEl.style.color= 'red';
            pEl.style.backgroundColor = 'orange';

            // 修改的 都是 行内样式   


            // 如何获取样式 打印当前字体颜色 
            // 行内样式
            console.log(pEl.style.color);
            // console.log(pEl.style.fontStyle);

        }
    </script>
</body>
</html>